<template>
	<view>
		<swiper :indicator-dots="true" indicator-color="#4cd964" indicator-active-color="#dd524d" :autoplay="true" :interval="3000" :duration="1000">
			<swiper-item>
				<view class="swiper-item">
					<image style="height: 300rpx;width: 100%;" src="/static/image/banner/banner01.png" mode="aspectFit"></image>
				</view>
			</swiper-item>
			<swiper-item>
				<view class="swiper-item">
					<image style="height: 300rpx;width: 100%;" src="/static/image/banner/banner02.png" mode="aspectFit"></image>
				</view>
			</swiper-item>
			<swiper-item>
				<view class="swiper-item">
					<image style="height: 300rpx;width: 100%;" src="/static/image/banner/banner03.png" mode="aspectFit"></image>
				</view>
			</swiper-item>
		</swiper>
		
		<swiper :indicator-dots="true" indicator-color="#4cd964" indicator-active-color="#dd524d" :autoplay="true" :interval="3000" :duration="1000">
			<swiper-item v-for="(item, index) in imgList">
				<view class="swiper-item">
					<image style="height: 300rpx;width: 100%;" :src="item" mode="aspectFit"></image>
				</view>
			</swiper-item>
		</swiper>
	</view>
</template>
<script setup>
	import { ref } from 'vue';

	const imgList=ref(['/static/image/banner/banner01.png','/static/image/banner/banner02.png','/static/image/banner/banner03.png']);
</script>
